<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <title>404</title>
    <!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8" />
    <meta name="keywords" content="" />
    <script>
        addEventListener("load", function() {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
        }
    </script>
    <!-- //Meta tag Keywords -->
    <!-- Custom-Files -->
    <link rel="stylesheet" href="../static/css/bootstrap.css" th:href="@{/css/bootstrap.css}">
    <!-- Bootstrap-Core-CSS -->
    <link rel="stylesheet" href="../static/css/style.css" th:href="@{/css/style.css}" type="text/css" media="all" />
    <!-- Style-CSS -->
    <!-- font-awesome-icons -->
    <link href="../static/css/font-awesome.css" th:href="@{/css/font-awesome.css}" rel="stylesheet">
    <!-- //font-awesome-icons -->
    <!-- /Fonts -->
    <link href="http://fonts.googleapis.com/css?family=Hind:300,400,500,600,700" rel="stylesheet">
    <!-- //Fonts -->
</head>
<body>
    <!-- //header -->
    <header style="background:#74d2e7 " class="py-sm-3 pt-3 pb-2" id="home">
        <div class="container">
            <!-- nav -->
            <div class="top-w3pvt d-flex">
                <div id="logo">
                    <h1> <a href="index.html"><span class="log-w3pvt">B</span>aggage</a> <label class="sub-des">Online Store</label></h1>
                </div>

                <div class="forms ml-auto">
                            <span class="avatar">
                                <span>用户名</span>
                            </span>
                    <a href="login.html" th:href="@{/login}" class="btn"><span class="fa fa-user-circle-o"></span> 登录</a>
                    <a href="register.html" th:href="@{/register}" class="btn"><span class="fa fa-pencil-square-o"></span> 注册</a>
                </div>
            </div>
            <div class="nav-top-wthree">
                <nav>
                    <label for="drop" class="toggle"><span class="fa fa-bars"></span></label>
                    <input type="checkbox" id="drop" />
                    <ul class="menu">
                        <li  th:classappend="${n ==1} ? 'active' "><a href="index.html" th:href="@{/}">主页</a></li>
                        <li th:classappend="${n ==2} ? 'active' "><a href="about.html" th:href="@{/about}">关于我们</a></li>
                        <li>
                            <!-- First Tier Drop Down -->
                            <label for="drop-2" class="toggle">Dropdown <span class="fa fa-angle-down" aria-hidden="true"></span>
                            </label>
                            <a th:classappend="${n ==3} ? 'active' " href="#">系列 <span class="fa fa-angle-down" aria-hidden="true"></span></a>
                            <input type="checkbox" id="drop-2" />
                            <ul>
                                <li><a href="about.html" class="drop-text">特色</a></li>
                                <li><a href="goods.html" th:href="@{/goods?id=1}" class="drop-text">热卖</a></li>

                            </ul>
                        </li>

                        <li th:classappend="${n ==4} ? 'active' "><a href="shop.html" th:href="@{/shop}">商品</a></li>
                        <li th:classappend="${n ==5} ? 'active' "><a href="contact.html">联系我们</a></li>
                        <li th:classappend="${n ==6} ? 'active' "><a href="shopcar.html" th:href="@{/shopcar}">购物车</a></li>
                    </ul>
                </nav>
                <!-- //nav -->
                <div class="search-form ml-auto">
                    <div class="form-w3layouts-grid">
                        <form action="#" method="post" class="newsletter">
                            <input class="search" type="search" placeholder="Search here..." required="">
                            <button class="form-control btn" value=""><span class="fa fa-search"></span></button>
                        </form>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </header>
    <!-- //header -->

    <!--错误信息-->
    <div style="margin: 0 auto;padding-top: 64px">
        <p style="font-size: 26px;color: red;text-align: center;">你访问的资源不存在！</p>

    </div>

    <!-- footer -->
    <div  class="footer_agileinfo_topf py-5">
        <div class="container py-md-5">
            <div class="row">
                <div class="col-lg-3 footer_wthree_gridf mt-lg-5">
                    <h2><a href="index.html"><span>B</span>aggage
                    </a> </h2>
                    <label class="sub-des2">Online Store</label>
                </div>
                <div class="col-lg-3 footer_wthree_gridf mt-md-0 mt-4">
                    <ul class="footer_wthree_gridf_list">
                        <li>
                            <a href="index.html" th:href="@{/}"><span class="fa fa-angle-right" aria-hidden="true"></span> 主页</a>
                        </li>
                        <li>
                            <a href="about.html" th:href="@{/about}"><span class="fa fa-angle-right" aria-hidden="true"></span> 关于我们</a>
                        </li>
                        <li>
                            <a href="shop.html" th:href="@{/shop}"><span class="fa fa-angle-right" aria-hidden="true"></span> 商品</a>
                        </li>

                    </ul>
                </div>
                <div class="col-lg-3 footer_wthree_gridf mt-md-0 mt-sm-4 mt-3">
                    <ul class="footer_wthree_gridf_list">

                        <li>
                            <a href="#"><span class="fa fa-angle-right" aria-hidden="true"></span> 条款&条件</a>
                        </li>
                        <li>
                            <a href="goods.html"><span class="fa fa-angle-right" aria-hidden="true"></span> 热卖</a>
                        </li>
                        <li>
                            <a href="contact.html" th:href="@{/contact}"><span class="fa fa-angle-right" aria-hidden="true"></span> 联系我们</a>
                        </li>
                    </ul>
                </div>

                <div class="col-lg-3 footer_wthree_gridf mt-md-0 mt-sm-4 mt-3">
                    <ul class="footer_wthree_gridf_list">
                        <li>
                            <a href="login.html"><span class="fa fa-angle-right" aria-hidden="true"></span> 登录 </a>
                        </li>

                        <li>
                            <a href="register.html"><span class="fa fa-angle-right" aria-hidden="true"></span>注册</a>
                        </li>
                        <li>
                            <a href="#"><span class="fa fa-angle-right" aria-hidden="true"></span>隐私&政策</a>
                        </li>

                    </ul>
                </div>
            </div>

            <div class="w3ls-fsocial-grid">
                <h3 class="sub-w3ls-headf">Follow Us</h3>
                <div class="social-ficons">
                    <ul>
                        <li><a href="#"><span class="fa fa-facebook"></span> Facebook</a></li>
                        <li><a href="#"><span class="fa fa-twitter"></span> Twitter</a></li>
                        <li><a href="#"><span class="fa fa-google"></span>Google</a></li>
                    </ul>
                </div>
            </div>
            <div class="move-top text-center mt-lg-4 mt-3">
                <a href="#home"><span class="fa fa-angle-double-up" aria-hidden="true"></span></a>
            </div>
        </div>
    </div>
    <!-- //footer -->
    <!-- copyright -->
    <div  class="cpy-right text-center py-3">
        <p>Copyright &copy; 2020. 2.2  記憶ミ || 初见ミ</p>

    </div>
    <!-- //copyright -->

</body>
</html>